<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>系统人员</title>
    <script th:src="@{/layui/layui.js}" type="text/javascript"></script>
    <link th:href="@{/layui/css/layui.css}" rel="stylesheet" />
    <style>
        .layui-upload-img{
            border: 1px solid #1E9FFF;
            width: 200px;
            height: 200px;
            border-radius: 200px;;
        }
    </style>
</head>
<body>

    <div style="margin: 20px">
        <form class="layui-form layui-form-pane">
            <input type="hidden" id="photoPath" name="photoPath">
            <div class="layui-form-item">
                <label class="layui-form-label">收件人名称</label>
                <div class="layui-input-block">
                    <input class="layui-input" name="name" autocomplete="off" placeholder="输入收件人名称">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">手机号</label>
                <div class="layui-input-block">
                    <input class="layui-input" name="phone" autocomplete="off" placeholder="输入手机号">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">区域地址</label>
                <div class="layui-input-block">
                    <input  class="layui-input" name="aAddress" autocomplete="off" placeholder="选择地址">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">详细地址</label>
                <div class="layui-input-block">
                    <input class="layui-input" name="dAddress" autocomplete="off" placeholder="填写详细地址">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">是否默认地址</label>
                <div class="layui-input-block">
                    <input type="radio" value="是" class="layui-input" name="aDefault" autocomplete="off" placeholder="选择是否默认">
                </div>
            </div>
            <div class="layui-form-item" style="display: none">
                <div class="layui-input-block">
                    <a class="layui-btn" lay-submit="" lay-filter="submitBtn" id="submitBtn"></a>
                </div>
            </div>
        </form>
    </div>
    <script>
        var $;
        layui.use(['form','jquery','upload','element','layer'],function () {
            var form = layui.form,
                upload = layui.upload,
                layer = layui.layer,
                elem = layui.element;
            $ = layui.jquery;
            
            
            //头像上传
            var photoUpload = upload.render({
                elem:'#checkPhoto',
                url:'/file/fc/fileUpload',
                before: function (obj) {
                    obj.preview(function (i,f,r) {
                        $('#photo').attr('src',r);
                    });
                    elem.progress('photoProgress','0%');
                },
                done:function (res) {
                    if(!res.is){
                        layer.alert('上传失败，请稍后再试......')
                    }else{
                        $('#photoPath').val(res.file.id);
                    }
                },
                error:function(){

                },
                progress:function (n,el,e) {
                    elem.progress('photoProgress',n+'%');
                    if(n==100){
                        layer.msg('上传完成!',{icon:1});
                    }
                }
            })

            form.on('submit(submitBtn)',function (data) {
                var formData = data.field;
                $.ajax({
                    type:'post',
                    url:'/system/ac/add',
                    data:formData,
                    dataType:'json',
                    success:function (result) {
                        layer.msg(result.msg);
                        if(result.is){
                            let index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);//关闭父页面窗口
                        }
                    }
                })
            })
            
        })

        function btnSubmit() {
            $('#submitBtn').click();
        }
    </script>

</body>
</html>